<script setup lang="ts">
const item = JSON.parse(localStorage.getItem("json") as string);
const router = useRouter();
</script>

<template>
  <div class="w-100% h-20px flex items-center justify-between">
    <div class="flex">
      <van-icon
        @click="router.push('/message')"
        class="mt-2"
        size="24"
        name="arrow-left"
      />
      <p class="leading-10 ml-2">{{ item.name }}</p>
    </div>
    <div>
      <van-icon name="phone-o" size="32" class="mx-2" />
      <van-icon name="list-switch" size="32" class="mx-1" />
    </div>
  </div>
  <div>
    <div class="w-[100%] fixed bottom-0">
      <div class="w-100% flex items-center justify-evenly">
        <input type="text" class="w-[70%] border-2 h-10" placeholder="123" />
        <van-button type="primary">主要按钮</van-button>
      </div>
      <div class="w-96 items-center justify-evenly mx-auto mt-2">
        <van-icon name="volume-o" size="28" class="mx-4" />
        <van-icon name="photo-o" size="28" class="mx-4" />
        <van-icon name="video-o" size="28" class="mx-4" />
        <van-icon name="bill-o" size="28" class="mx-4" />
        <van-icon name="smile-o" size="28" class="mx-4" />
        <van-icon name="add-o" size="28" class="mx-4" />
      </div>
    </div>
  </div>
</template>

<style scoped>
</style>